<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录页</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/login.min.css">
</head>

<body>
    <div class="wrap">
        <div class="main">
            <!-- 头部 -->
            <div class="top">
                <div class="border-top"></div>
                <div class="header">
                    <!-- logo -->
                    <div class="logo">
                        <img src="./image/common/logo.png" alt="图片加载中" />
                    </div>
                    <!-- 导航栏 -->
                    <div class="nav">
                        <ul>
                            <li class="active" data-index=0 onclick="change(this,'.nav ul>li','active')"><a
                                    href="##">首页</a></li>
                            <li data-index=1 onclick="change(this,'.nav ul>li','active')"><a href="##">关于鼎搜</a></li>
                            <li data-index=2 onclick="change(this,'.nav ul>li','active')"><a href="##">鼎搜服务</a></li>
                            <li data-index=3 onclick="change(this,'.nav ul>li','active')"><a href="##">鼎搜动态</a></li>
                            <li data-index=4 onclick="change(this,'.nav ul>li','active')"><a href="##">鼎搜诚聘</a></li>
                            <li data-index=5 onclick="change(this,'.nav ul>li','active')"><a href="##">鼎搜公益</a></li>
                        </ul>
                    </div>
                    <!-- 搜索框 -->
                    <div class="search">
                        <input type="text">
                        <i class="icon-search"></i>
                    </div>
                </div>
                <!-- 轮播图 -->
                <div class="swiper">
                    <img class="slide active" src="./image/common/slides-bg.png" alt="" />
                    <img class="slide" src="./image/common/slides-bg.png" alt="" />
                    <img class="slide" src="./image/common/slides-bg.png" alt="" />
                    <!-- 底部圆点 -->
                    <div class="dot">
                        <i class="point active" data-index=0></i>
                        <i class="point" data-index=1></i>
                        <i class="point" data-index=2></i>
                    </div>
                </div>
            </div>

            <!-- 主体内容 -->
            <div class="middle">
                <!-- 我要转让 -->
                <div class="login">
                    <div class="container">
                        <div class="title">
                            <h3>我要转让</h3>
                            <p>WO YAO ZHUAN RANG</p>
                        </div>
                    </div>
                    <div class="form">
                        <div class="form-left">
                            <!-- 登录和注册 -->
                            <ul class="toggle">
                                <li data-index=0 onclick="change(this,'.toggle>li','active')" class="sign active">点击登录
                                </li>
                                <li data-index=1 onclick="change(this,'.toggle>li','active')" class="register">点击注册
                                </li>
                            </ul>
                            <form action="">
                                <div class="username">
                                    <label>用户名:</label>
                                    <input type="text" placeholder="请输入用户名" />
                                </div>
                                <div class="pwd">
                                    <label for="">密码:</label>
                                    <input type="password" placeholder="请输入密码" />
                                </div>
                                <div class="verification">
                                    <label>验证码:</label>
                                    <input type="text" placeholder="请输入验证码">
                                    <img src="./image/login/verification.png" alt="">
                                    <span>看不清</span>
                                    <span class="change">点击更换</span>
                                </div>
                                <div class="lifespan">
                                    <label>有效期:</label>
                                    <input type="radio" name="date" value="month" checked><span>一个月</span>
                                    <input type="radio" name="date" value="week"><span>一周</span>
                                    <input type="radio" name="date" value="day"><span>一天</span>
                                    <input type="radio" name="date" value="now"><span>即时</span>
                                </div>
                                <div class="btn">
                                    <button>登录</button>
                                    <span>忘记密码?</span>
                                </div>
                            </form>
                        </div>
                        <div class="bg-right"></div>
                    </div>
                </div>
            </div>

            <!-- 页脚 -->
            <footer>
                <!-- 装饰线 -->
                <hr />
                <!-- 列表 -->
                <div class="footer">
                    <ul>
                        <li>简介</li>
                        <li><a href="javascript;">鼎搜网简介</a></li>
                        <li><a href="javascript;">鼎搜服务</a></li>
                        <li><a href="javascript;">会员身份认证</a></li>
                    </ul>
                    <ul>
                        <li>帮助</li>
                        <li><a href="javascript;">用户注册</a></li>
                        <li><a href="javascript;">关于鼎搜</a></li>
                        <li><a href="javascript;">在线咨询</a></li>
                    </ul>
                    <ul>
                        <li>共赢</li>
                        <li><a href="javascript;">网站合作</a></li>
                        <li><a href="javascript;">用户协议</a></li>
                        <li><a href="javascript;">会员身份认证</a></li>
                    </ul>
                    <ul>
                        <li>导航</li>
                        <li><a href="javascript;">地图首页</a></li>
                        <li><a href="javascript;">职能分类</a></li>
                        <li><a href="javascript;">企业名录</a></li>
                    </ul>
                    <div class="connect">
                        <img src="./image/common/connect.png" alt="" />
                    </div>
                </div>

                <!-- 底部蓝色 -->
                <div class="border-bottom">
                    Copyright &copy;2015 鼎搜网(www.dinsoo.com) 版权所有
                </div>
            </footer>
        </div>
    </div>
</body>
<script src="./js/index.js" rel="script"></script>

</html>